<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
  <title>密码学课堂-首页</title>
  <link rel="stylesheet" href="../res/layui/css/layui.css">
  <link rel="stylesheet" href="../res/static/css/index.css">
</head>
<body>
  <!-- nav部分 -->
  <div class="nav index">
    <div class="layui-container">
      <!-- logo -->
      <div class="nav-logo" style=font-size:30px>
        <a href="index.html">
          <!-- <img src="../res/static/img/logo.png" alt="密码学课堂">   -->
          <span class="logo-span"><h1>密码学课堂</h1></span>        
        </a>
      </div>
      <div class="nav-list">
        <button>
          <span></span><span></span><span></span>
        </button>
        <ul class="layui-nav" lay-filter="">
          <li class="layui-nav-item"><a href="../timeline/index.html">教学</a></li>
          <li class="layui-nav-item"><a href="../challenge/UI/index.html" target="self">挑战</a></li>
          <li class="layui-nav-item"><a href="https://adworld.xctf.org.cn/task?now_checked_num=5&name=crypto" target="self">作业</a></li>
          <li class="layui-nav-item"><a href="">通知</a></li>
          <li class="layui-nav-item"><a href="">关于</a></li>
          <li class="layui-nav-item"><a href="../login/login.html" target="_blank">登录/注册</a></li>
        </ul>
      </div>
    </div>
  </div>
  <!-- banner部分 -->
  <div>
    <div class="layui-carousel" id="banner">
      <div carousel-item>
        <div>
          <img src="../res/static/img/banner1.jpg">
          <div class="panel">
            
          </div>
        </div>
        <div>
          <img src="../res/static/img/banner2.jpg">
          <div class="panel">
            
          </div>
        </div>
		<div>
          <img src="../res/static/img/banner3.jpg">
          <div class="panel">
            <p class="title">密码学课堂</p>
            <p>算法不再困难</p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- main部分 -->
  <div class="main-product">
    <div class="layui-container">
      <p class="title">专为密码学而研制的<span>轻松课堂</span></p>
      <div class="layui-row layui-col-space25">
        <div class="layui-col-sm6 layui-col-md3">
          <div class="content">
            <div><img src="../res/static/img/Big_icon1.png"></div>
            <div>
              <p class="label">摩斯密码</p>
              <p>是一种时通时断的信号代码，通过不同的排列顺序来表达不同的英文字母、数字和标点符号。</p>
            </div>
            <a href="../morse/index.html">查看详细></a>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="content">
            <div><img src="../res/static/img/Big_icon2.png"></div>
            <div>
              <p class="label">凯撒密码</p>
              <p>一种替换加密的技术，明文中的字母都在字母表上向后或向前按照一个固定数目进行偏移后被替换成密文。</p>
            </div>
            <a href="javascript:;">查看详细 ></a>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="content">
            <div><img src="../res/static/img/Big_icon3.png"></div>
            <div>
              <p class="label">RSA</p>
              <p>一种非对称加密演算法，加密和解密使用同一套规则,在公开密钥加密和电子商业中被广泛使用。</p>
            </div>
            <a href="javascript:;">查看详细 ></a>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="content">
            <div><img src="../res/static/img/Big_icon4.png"></div>
            <div>
              <p class="label">DES</p>
              <p>是一种对称密钥加密块密码算法，1976年被美国联邦政府的国家标准局确定为联邦资料处理标准（FIPS）。</p>
            </div>
            <a href="javascript:;">查看详细 ></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="main-service">
    <div class="layui-container">
      <p class="title">为你打造完美的<span>课堂服务</span></p>
      <div class="layui-row layui-col-space25 layui-col-space80">
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../res/static/img/home_img1.jpg"></div>
            <div class="content-right">
              <p class="label">生动形象的讲解密码学算法</p>
              <span></span>
              <p>包含古典现代多个密码算法，通过动画展示、实践操作、习题巩固，大幅提升学习效率。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../res/static/img/home_img2.jpg"></div>
            <div class="content-right">
              <p class="label">生动形象的讲解密码学算法</p>
              <span></span>
              <p>包含古典现代多个密码算法，通过动画展示、实践操作、习题巩固，大幅提升学习效率。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../res/static/img/home_img3.jpg"></div>
            <div class="content-right">
              <p class="label">生动形象的讲解密码学算法</p>
              <span></span>
              <p>包含古典现代多个密码算法，通过动画展示、实践操作、习题巩固，大幅提升学习效率。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="../res/static/img/home_img4.jpg"></div>
            <div class="content-right">
              <p class="label">生动形象的讲解密码学算法</p>
              <span></span>
              <p>包含古典现代多个密码算法，通过动画展示、实践操作、习题巩固，大幅提升学习效率。</p>
            </div>
          </div>
        </div>
      </div>
      <div class="service-more"><a href="">查看更多</a></div>
    </div>
  </div>
  <!-- footer部分 -->
  <div class="footer">
    <div class="layui-container">
      <p class="footer-web">
        
      </p>
      <div class="layui-row footer-contact">
        <div class="layui-col-sm2 layui-col-lg1"></div>
        <div class="layui-col-sm10 layui-col-lg11">
          <div class="layui-row">
            <div class="layui-col-sm6 layui-col-md8 layui-col-lg9">
              
            </div>
            <div class="layui-col-sm6 layui-col-md4 layui-col-lg3">
              
             
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
<script src="../res/layui/layui.js"></script>
<!--[if lt IE 9]>
  <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
  <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
  layui.config({
    base: '../res/static/js/' 
  }).use('firm'); 
</script>
</body>
</html>